<template>
    <el-dialog :title="$t('OrderRefund.examine')" v-model="show" :close-on-click-modal="false" draggable width="600px">

            
        <el-form :data="formData">
            <el-form-item :label="$t('OrderRefund.passOrNot')">
                <el-radio-group v-model="formData.isApprove"> 
                    <el-radio :label="true">{{$t("OrderRefund.pass")}}</el-radio>
                    <el-radio :label="false">{{$t("OrderRefund.reject")}}</el-radio>
                </el-radio-group>
            </el-form-item>

            <el-form-item :label="$t('OrderRefund.rejectReason')" v-if="!formData.isApprove">
                <el-input v-model="formData.rejectReason" type="textarea" :rows="4" :placeholder="$t('OrderRefund.rejectReason')" />
            </el-form-item>
        </el-form>
        <template #footer>
      <span class="dialog-footer">
        <el-button @click="closeFn">{{ $t('common.cancelButtonText') }}</el-button>
        <el-button type="primary" @click="onSubmit" >{{ $t('common.confirmButtonText') }}</el-button>
      </span>
    </template>
    </el-dialog>

</template>
<script lang="ts" setup>
import {  refundPayAPI } from "/@/api/bizs/OrderRefund";
import { useMessage, useMessageBox } from "/@/hooks/message";
import { useI18n } from 'vue-i18n';

const emit = defineEmits(['getList'])
const { t } = useI18n();
    interface IFormDat {
        rejectReason:"",
        isApprove:false
    }
    const show =ref(false)
    const formData = reactive<IFormDat>({
        rejectReason:"",
        isApprove:false,
        
    })

    const refundId = ref("")

    const openDialog = (id:string) =>{
        show.value = true
        initFormData()
        refundId.value = id
        

    }

    const closeFn = ()=>{
        show.value = false
    }

    const initFormData = ()=>{
        refundId.value = ""
    }

    const onSubmit = async ()=>{

        await useMessageBox().confirm(t('OrderRefund.confirmOrNot'));

        
        let res = await refundPayAPI(refundId.value,formData)
        if(res.code == 0){
            useMessage().success(t('OrderRefund.success'));
        }else{
            useMessage().error(t("OrderRefund.operationFailure"));
        }
        emit("getList")
        closeFn()
    }

    defineExpose({
        openDialog
    })

</script>